<template>
    <div class="pages productDetail">
      <van-panel style="height: 100%;background-color: rgb(244,243,249);">
        <div class="imgBox">
          <productType ref="productType" v-for="(item,index) in detailListCopy" :pid="id"  @changeDom="getListFun" :key="index" :detail="item"></productType>
        </div>

      </van-panel>
    </div>
</template>

<script>
    import productType from '../../components/productType.vue'
  import * as host from "../../utils/api"
  export default {
    name: 'index',
    data () {
      return {
          detailListCopy:[],
          pageNum:1,
          pageSize:10,
          id:{
              id:""
          },
          result:[]
      }
    },

    onLoad (id) {
      this.id = id;
        let pages = getCurrentPages();
        let prevpage = pages[pages.length - 2];
        console.log(prevpage.route)
    },
      onShow () {
          wx.setNavigationBarTitle({
              title: '产品分类'
          })
          this.pageNum=1;
          console.log(this.id)
      },


      onReady(){
          this.getList(this.id.id)
      },
      onPullDownRefresh(){
          console.log('down')
          if(this.result.length){
              this.pageNum++;
          }
          this.getList(this.id.id)

      },
      onReachBottom () {
          wx.showNavigationBarLoading()
          console.log('pull')
          if(this.result.length){
              this.pageNum++;
          }
          this.getList(this.id.id)
          // wx.stopPullDownRefresh()
      },
    components: {
        productType
    },
    onUnload () {

    },
    methods: {
        getListFun(){
            this.getList(this.id.id)
        },
        getList(id){

            let cartId = wx.getStorageSync('cartId')
            this.$http.request({
                method: 'post',
                url: `/api/material/getChildPList`,
                body: {
                    cardId:cartId,
                    pageNum:this.pageNum,
                    pageSize:this.pageSize,
                    pid:id||0
                }
            }).then((data) => {
                if (data.code == 200) {
                    this.result=data.data.list;
                    this.result=data.data.list;
                    if (this.pageNum > 1) {
                        this.detailListCopy.push(... data.data.list)

                    }else{
                        this.detailListCopy = data.data.list;

                    }
                    let arr=this.detailListCopy.filter((item)=>{
                        return item.imgUrl==''
                    })
                    if(!arr.length){
                        this.detailListCopy.push({imgUrl:"", id: '',isClick:false,isEdit:true,description:""})
                    }

                } else {
                    wx.showToast({
                        title: `${data.message}`,
                        icon: 'none',
                        duration: 2000
                    })
                }
            }).catch((err) => {
                // this.isCart = false
            })
        },
    }
  }
</script>

<style>
  .productDetail ._van-panel{
    height: 100%;
    background-color: rgb(244,243,249);

  }
</style>
<style scoped>
  .pages{
    width: 100%;
    height: 100%;


  }
  .imgBox{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    box-sizing: border-box;
    padding: 5%;

  }

  .productBox{
    width: 100%;
    height: 100%;
    box-sizing: border-box;

    /*background-image: #fff;*/
  }
</style>
